@charset "utf-8";
@import "init";
@import "common";
.web {
    font-size: 16px;
    font-family: "微软雅黑";
    header {
        padding: 0 r(22);
        display: flex;
        justify-content: space-between;
        align-items: center;
        margin-top: r(17);
        height: r(123);
        .back {
            width: r(123);
            height: r(57);
            line-height: r(57);
            text-align: center;
            border: 2px solid $bg_color;
            border-radius: 15px;
            p {
                font-size: r(26);
                color: #000;
            }
        }
        .search_box2 {
            p {
                font-size: r(26);
            }
        }
        .city_box2 {
            i {
                color: $bg-color;
                font-size: r(48);
            }
        }
    }
    main {
        width: 100%;
        overflow-y: auto;
        position: absolute;
        left: 0;
        top: r(106);
        bottom: r(135);
        .banner {
            padding: r(25);
            div {
                width: r(703);
                height: r(258);
                img {
                    width: 100%;
                }
            }
        }
        .main_money {
            padding: 0 r(41);
            display: flex;
            justify-content: space-between;
            align-items: center;
            .main_money_text {
                p {
                    font-size: r(72);
                    color: $bg-color;
                }
            }
            .main_money_bt {
                button {
                    width: r(111);
                    height: r(60);
                    background-color: $bg-color;
                    border-radius: r(15);
                    font-size: r(30);
                    color: white;
                    border: 0;
                }
            }
        }
        .main_rating {
            padding: r(37) r(42);
            display: flex;
            justify-content: space-between;
            align-items: center;
            .main_rating_left {
                display: flex;
                i {
                    font-size: r(35);
                    color: $bg-color;
                }
                p {
                    font-size: r(30);
                    padding-left: r(15);
                }
                span {
                    font-size: r(30);
                    color: $bg-color;
                }
            }
            .main_rating_right {
                p {
                    a {
                        font-size: r(26);
                        color: $text-color;
                    }
                }
            }
        }
        .main_merchants {
            margin: 0 r(43);
            height: r(66);
            background-color: $bg-color;
            display: flex;
            justify-content: space-between;
            align-items: center;
            .main_merchants_left {
                padding-left: r(12);
                p {
                    font-size: r(30);
                    color: white;
                }
            }
            .main_merchants_right {
                padding-left: r(12);
                a {
                    font-size: r(47);
                    color: white;
                }
            }
        }
        .main_goods {
            padding: 0 r(42) r(12);
            display: flex;
            justify-content: space-between;
            align-items: center;
           
            .main_goods_left {
                 position: relative;
                .main_goods_img {
                    width: r(176);
                    height: r(176);
                    overflow: hidden;
                   
                    img {
                        width: 100%;
                        
                    }
                    
                }
                .mask{
                    width: r(176);
                    height: r(37);
                    background-color: rgba(255,255,255,0.5);
                    text-align: center;
                    position: absolute;
                    left: 0;
                    top: 50%;
                    line-height: r(37);
                    p{
                      font-size: r(24);  
                    }
                }
            }
            .main_goods_right {
                display: flex;
                flex-basis: 100%;
                justify-content: space-between;
                align-items: center;
                margin-left: r(25);
                .main_goods_text {
                    p {
                        font-size: r(30);
                    }
                    .text_icon{
                        padding: r(2) 0;
                        i{
                            font-size: r(32);
                            color: $bg-color;
                        }
                        span{
                           font-size: r(26);
                            color: $text-color; 
                        }
                    }
                    .text_distance{
                        padding-bottom: r(22);
                        p{
                            font-size: r(24);
                            color: $text-color; 
                        }
                    }
                    .text_details{
                        a{
                          font-size: r(20);
                            color: $bg-color;   
                        }
                    }
                }
                .main_goods_bt{
                    button{
                        width: r(110);
                        height: r(60);
                        background-color: $bg-color;
                        border-radius: r(15);
                        border:none;
                        text-align: center;
                        a{
                            font-size: r(30);
                            color: white; 
                        }
                    }
                }
            }
        }
        .main_goods:nth-last-child(3){
            padding-top: r(12);
            
        }
    }
}